import React from "react";
import BaseButton from "../todo-list/components/BaseButton";
class LifeCircle extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      count: 0,
    };
  }
  // UNSAFE_componentWillMount() {
  //   console.log("will mount");
  // }
  componentDidMount() {
    console.log("mounted");
  }
  // UNSAFE_componentWillReceiveProps(props) {
  //   console.log("componentWillReceiveProps");
  // }
  shouldComponentUpdate(nextProps, nextState) {
    console.log("shouldComponentUpdate", nextState);
    return true;
  }
  // UNSAFE_componentWillUpdate() {
  //   console.log("componentWillUpdate");
  // }
  componentDidUpdate() {
    console.log("updated");
  }
  static getDerivedStateFromProps(nextProps, prevState) {
    return {
      count: prevState.count + 1,
    };
  }
  render() {
    const { count } = this.state;
    return (
      <div>
        <h3>{count}</h3>
        <BaseButton
          onClick={() => {
            this.setState((state, props) => ({
              count: state.count + 1,
            }));
          }}
        >
          add
        </BaseButton>
      </div>
    );
  }
}
export default LifeCircle;
